<template>
	<view class="cu-w-100">
		<template v-if="fill == true">
			<view class="cu-w-100 cu-p-20 cu-shadow cu-bg-white cu-border-box cu-border-r-20" :style="[getStyle]">
				<slot></slot>
			</view>
		</template>
		<template v-if="fill == false">
			<view class="cu-w-100 cu-p-20 cu-border-box" :style="[getStyle]">
				<view class="cu-w-100 cu-p-20 cu-shadow cu-bg-white cu-border-box cu-border-r-20" :style="[getInnerStyle]">
					<slot></slot>
				</view>
			</view>
		</template>
	</view>
</template>

<script>
	export default {
		props: {
			fill: {
				type: Boolean,
				default: true
			},
			style: {
				type: Object,
				default: undefined
			},
			innerStyle: {
				type: Object,
				default: undefined
			},
		},
		data() {
			return {
				
			};
		},
		computed:{
			getStyle(){
				let style = {};
				// 合并用户传递的背景色对象
				Object.assign(style, this.style);
				return style;
			},
			getInnerStyle(){
				let style = {};
				// 合并用户传递的背景色对象
				Object.assign(style, this.innerStyle);
				return style;
			},
		}
	}
</script>

<style lang="scss">
	
</style>
